<script setup>
</script>

<template>
  <div>
    <van-cell title="我的优惠券" icon="arrow-left" to="wode" />
    <van-card num="2" thumb="https://img.yzcdn.cn/vant/ipad.jpeg">
      <template #tags>
        <div class="yhq">
          <div class="top">
            <span style="font-size: 15px">通用券</span>
            <van-button round plain type="primary" size="small"
              >立即使用</van-button
            >
          </div>
          <span style="color: #ccc; font-size: 13px"
            >有效期2019-08-01-2019-09-30</span
          >
        </div>
      </template>
      <template #footer> </template>
    </van-card>
    <van-card num="2" thumb="https://img.yzcdn.cn/vant/ipad.jpeg">
      <template #tags>
        <div class="yhq">
          <div class="top">
            <span style="font-size: 15px">通用券</span>
            <van-button round plain type="primary" size="small"
              >立即使用</van-button
            >
          </div>
          <span style="color: #ccc; font-size: 13px"
            >有效期2019-08-01-2019-09-30</span
          >
        </div>
      </template>
      <template #footer> </template>
    </van-card>
    <van-card num="2" thumb="https://img.yzcdn.cn/vant/ipad.jpeg">
      <template #tags>
        <div class="yhq">
          <div class="top">
            <span style="font-size: 15px">通用券</span>
            <van-button round plain type="primary" size="small"
              >立即使用</van-button
            >
          </div>
          <span style="color: #ccc; font-size: 13px"
            >有效期2019-08-01-2019-09-30</span
          >
        </div>
      </template>
      <template #footer> </template>
    </van-card>
    <van-card thumb="https://img.yzcdn.cn/vant/ipad.jpeg">
      <template #tags>
        <div class="yhq">
          <div class="top">
            <span style="font-size: 15px">通用券</span>
            <van-button round plain type="default" size="small"
              >已过期</van-button
            >
          </div>
          <span style="color: #ccc; font-size: 13px"
            >有效期2019-08-01-2019-09-30</span
          >
        </div>
      </template>
      <template #footer> </template>
    </van-card>
  </div>
</template>



<style scoped>
.van-cell {
  font-size: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid #000;
}
.yhq {
  height: 100px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.yhq .top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
</style>